<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>三诺分钟诊所管理系统</title>
    <link rel="stylesheet" type="text/css" href="css/login.css">
</head>
<body>
<div style="width:700px; margin-left: auto;margin-right: auto; margin-top:50px;">
    <span style="float:left;"><img src="images/logo.png" width="350" style="margin-top:4px"/></span>
    <h1 style="float:left;color:#fff; font-size: 40px;">分钟诊所管理系统</h1>
</div>
<div id="wrapper" class="login-page">
    <div id="login_form" class="form">
        <form id="login-form" class="login-form">
            <h2>管理登录</h2>
            <input type="text" placeholder="用户名" id="user_name" name="account"/>
            <input type="password" placeholder="密码" id="password" name="apssword"/>
            <input type="button" id="login" value="登  录" style="background-color: #0cc215; color: #333333">
        </form>
    </div>
</div>

<script src="js/jquery.min.js"></script>
<script src="layui-v2.5.5/layui/layui.all.js"></script>
<script src="js/vue.js"></script>
<script type="text/javascript">

    $(function () {
        $("#login").click(function () {
            var loadingIndex = null;
            var account = $("#user_name").val();
            var apssword = $("#password").val();
            if (account == "" || apssword == "") {
                $("#login_form").removeClass('shake_effect');
                setTimeout(function () {
                    $("#login_form").addClass('shake_effect')
                }, 1);
            }else {
                $.ajax({
                    url : "/sign_in",
                    type : "POST",
                    data: $("#login-form").serialize(),
                    beforeSend : function(){
                        loadingIndex = layer.msg('正在登录...', {icon: 16});
                    },
                    success : function (result) {
                        layer.close(loadingIndex);
                        if (result.code == '200'){
                            window.location.href = result.url;
                        }
                        if (result.code == '201'){
                            layer.msg(result.maggers, {time:1000, icon:5, shift:6});
                        }
                        if (result.code == '202'){
                            layer.msg(result.maggers, {time:1000, icon:5, shift:6});
                        }
                    }
                })
            }
        })
    })

</script>
</body>
</html>